<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8"/>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
    <title>首页</title>
    <link rel="stylesheet" href="css/bootstrap.min.css"/>
    <link rel="stylesheet" href="css/animate.min.css"/>
    <link rel="stylesheet" href="css/wxstyle.css"/>
    <link rel="stylesheet" type="text/css" href="css/pcgwbase.css"/>


</head>

<body class="wyhome">

<div id="index" v-cloak>
    <div id="header" v-cloak>
    </div>

    <!--轮播-->
    <div class="xybanner">
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
            <div class="carousel-inner" role="listbox">
                <div class="item active">
                    <img :src="bannerImage" alt="..." style="width:100%;">
                </div>
            </div>
        </div>
    </div>

    <div v-for="(item,index) in homePageFloor">
        <!-- 1：产品,2:新闻,3:招聘,4:关于,5:合作 -->
        <div v-if="item.type === 1">
            <div class="interactbox wypro container">
                <div class="title_box">
                    <h2>{{item.viewName}}<a href="productlist.html" class="more_btn">MORE</a></h2>
                    <p>{{item.homePageDesc}}</p>
                </div>
                <div v-for="(item,index) in normalProductData">
                    <a class="interactbos" href="deproduct.html">
                        <div class="interact_left">
                            <img :src="item.bgimage"/>
                        </div>
                        <div class="interact_right">
                            <h3>{{item.name}}</h3>
                        </div>
                    </a>
                </div>
            </div>
        </div>
        <!-- 2:新闻 样式问题，默认只查4条数据-->
        <div v-if="item.type === 2">
            <div class="interactbox wypro container">
                <div class="title_box">
                    <h2>{{item.viewName}}<a href="productlist.html" class="more_btn">MORE</a></h2>
                    <p>{{item.homePageDesc}}</p>
                </div>
                <div class="news_block">
                    <div v-for="(item,index) in newsContent">
                        <!--  第一条显示成图片样式-->
                        <div v-if="index === 0">
                            <div class="news_bosleft">
                                <h4>{{item.createtime}}</h4>
                                <h4>{{item.title}}</h4>
                                <div class="news_img"></div>
                                <a href="news.html">了解更多</a>
                            </div>
                        </div>
                        <!-- 余下的右边列表排序 -->
                        <div v-else class="news_bosright">
                            <a class="news_item" href="denews.html">
                                <dl>
                                    <dt>{{item.title}}</dt>
                                    <dd>{{item.content}}</dd>
                                </dl>
                                <div class="news_item_time">
                                    <!-- <p>{{item.createtime}}</p>-->
                                    <p>2020</p>
                                    <p class="day">11-26</p>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 3:招聘 -->
        <div v-if="item.type === 3">
            <div class="interactbox wypro container">
                <div class="title_box">
                    <h2>{{item.viewName}}<a href="productlist.html" class="more_btn">MORE</a></h2>
                    <p>{{item.homePageDesc}}</p>
                </div>
                <div class="flli_itembox">
                    <div v-for="(item,index) in engage">
                        <ul>
                            <li>{{index + 1}}</li>
                            <li><a class="position_a">{{item.jobName}}</a></li>
                            <li>{{item.cityName}}</li>
                            <li>{{item.createtime}}</li>
                            <!-- 无此需求-->
                            <!-- <li><i class="eye"></i>{{item.cityName}}</li> -->
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-- 4:关于 -->
        <!-- 5:合作 -->
    </div>

    <!--
        职位详情
    -->
    <div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle"
         aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="position_item_block position_item_block1">
                        <div class="position_item">
                            <h4>2018新零售电商排名TOP100排行榜出炉</h4>
                            <p>
                                <span>2018-12-19</span>
                                <span>地点：深圳</span>
                                <span><img src="img/view.png" class="view_img1"/>666</span>
                            </p>
                        </div>
                    </div>
                    <div class="position_detail">
                        乘车路线：</br>
                        1、地铁11号线马安山站（A）出扣</br>
                        2、公交路线（m536）到奥创动力站下车</br>
                        这里有优秀的平台、真实的高薪、免费的住宿、完善的培训、公平公正公开的晋升，加入我们，让我们朝着梦想，一路向前!</br>
                        职位描述：</br>
                        1 负责平台官网、微信自媒体平台、微博等平台的推广及维护，网站更新，优化等。策划经验者优先；</br>
                        2具备责任心，快速执行力，超强学习能力，沟通能力要强；</br>
                        3 希望你文笔犀利 逻辑思维灵活；</br>
                        4 有互联网工作经验者优先。</br>
                        5 逻辑思维能力和创意能力强、文字功底深厚</br>
                        乘车路线：</br>
                        1、地铁11号线马安山站（A）出扣</br>
                        2、公交路线（m536）到奥创动力站下车</br>
                        这里有优秀的平台、真实的高薪、免费的住宿、完善的培训、公平公正公开的晋升，加入我们，让我们朝着梦想，一路向前!</br>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="footer"></div>

</body>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/vue.min.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdn.bootcss.com/qs/6.8.0/qs.min.js"></script>
<script type="text/javascript" src="js/web/axiosconfig.js"></script>
<script type="text/javascript" src="js/web/index.js"></script>
<script>
    $("#header").load("header.html");
    $("#footer").load("footer.html");

    jQuery('.position_a').on("click", function () {
        $('#exampleModalLong ').modal('hide');
        setTimeout(function () { //添加最小延时，避免model框弹出时给body添加padding
            $('#exampleModalLong ').modal('show');
        }, 320);
    });
</script>

</html>